<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8"/>
    <title>第六个</title>
    <link rel="stylesheet" href="/layui/css/layui.css"/>
</head>
<body>
<div class="layui-row layui-col-space30">
    <div class="layui-col-md4" style="background: red;color: #0C0C0C">
        1/3
    </div>
    <div class="layui-col-md4" style="background: green;color: #0C0C0C">
        1/3
    </div>
    <div class="layui-col-md4 layui-col-md4-offset4" style="background: blue;color: #0C0C0C">
        1/3
    </div>
</div>

<div class="layui-row">
    <div class="layui-col-md4" style="background: rebeccapurple;color: #1E9FFF">
        4/12
    </div>
    <div class="layui-col-md4 layui-col-md-offset4" style="background: orangered;color: #01AAED">
        偏移4列，从而在最右
    </div>
</div>


<div class="layui-row layui-col-space5">
    <div class="layui-col-lg5">
        <div class="layui-row grid-demo">
            <div class="layui-col-lg3">
                内部列
            </div>
            <div class="layui-col-lg9">
                内部列
            </div>
            <div class="layui-col-lg12">
                内部列
            </div>
        </div>
    </div>
    <div class="layui-col-lg7">
        <div class="layui-row grid-demo grid-demo-bg1">
            <div class="layui-col-lg12">
                内部列
            </div>
            <div class="layui-col-lg9">
                内部列
            </div>
            <div class="layui-col-lg3">
                内部列
            </div>
        </div>
    </div>
</div>
</body>
</html>